<style>
	.mb30{ margin-bottom: 30px;}
	.lin31{ line-height: 31px; min-width: 200px; }
	.form-horizontal .form-group{ margin-right: 0; margin-left: 0; }
	label{ color: #999999; }
	.mr15{ margin-right: 15px; }
	.le{ margin: 0 5px;}
	.navBar a{ margin-right: 15px; }
	.active{ color: #878CAD; position: relative; }
	.active:after{
		position: absolute;
		bottom: -14px;
		left: 0;
		content: '';
		display: block;
		width: 100%;
	 	border-bottom: 1px solid #878CAD;
	}
</style>
<div class="" ng-controller="contractDetailsCtrl">
	<div class="panel-heading navBar">
		<a class="active" href="javascript:;">合同信息</a>
		<a href="javascript:;">合同详情</a>
		<a href="javascript:;">补充详情</a>
	</div>
	<div class="ibox">
	    <div class="ibox-content formBar">
	    	<form class="form-horizontal m-t" id="_ajaxForm">
				<input type="text" name="id" value="" style="display: none;" ng-model="contractDatas.id">
				<div class="panel panel-default">
					<div class="panel-heading text-center">租客信息</div>
					<div class="panel-body">
						<div class="row">
							<div class="col-md-3 mb15">
								<p>姓名：</p>
								<div class="form-control lin31">{{contractDatas.tenantName}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>手机号：</p>
								<div class="form-control lin31">{{contractDatas.tenantPhone}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>身份证：</p>
								<div class="form-control lin31">{{contractDatas.tenantIdCard}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>银行卡号：</p>
								<div class="form-control lin31">{{contractDatas.tenantbank}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>预留手机号：</p>
								<div class="form-control lin31">{{contractDatas.beforPeoplePhone}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>紧急联系人：</p>
								<div class="form-control lin31">{{contractDatas.urgentPeopleRelation}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>联系人姓名：</p>
								<div class="form-control lin31">{{contractDatas.urgentPeopleName}}</div>
							</div>
							<div class="col-md-3 mb15">
								<p>联系人手机：</p>
								<div class="form-control lin31">{{contractDatas.urgentPeplePhone}}</div>
							</div>
						</div>
					</div>
				</div>
				<div class="panel panel-default">
					<div class="panel-heading text-center">租约信息</div>
					<div class="panel-body">
						<div class="row">
							<div class="col-md-12">
								<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">出租房源</label>
									    <div class="form-control lin31">{{contractDatas.communityName}}</div>
									    <label class="le"> > </label>
									    <div class="form-control lin31">{{contractDatas.detailedAddress}}</div>
									</div>
							  	</div>
							  	<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">固定租期</label>
									    <div class="form-control lin31">{{contractDatas.fixationStartTime}}</div>
									    <label class="le"> - </label>
									    <div class="form-control lin31">{{contractDatas.fixationEndTime}}</div>
									</div>
							  	</div>
							  	<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">灵活租期</label>
									    <div class="form-control lin31">{{contractDatas.flexibleStartTime}}</div>
									    <label class="le"> - </label>
									    <div class="form-control lin31">{{contractDatas.flexibleEndTime}}</div>
									</div>
							  	</div>
							  	<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">租期总长</label>
									    <div class="form-control lin31">{{contractDatas.leaseStartTime}}</div>
									    <label class="le"> - </label>
									    <div class="form-control lin31">{{contractDatas.leaseEndTime}}</div>
									</div>
							  	</div>
							  	<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">租金总额</label>
									    <div class="form-control lin31">{{contractDatas.totalAmount}}</div>
									    <label class="le">支付方式</label>
									    <div class="form-control lin31">{{contractDatas.paymentType}}</div>
									    <label class="le">押金</label>
									    <div class="form-control lin31">{{contractDatas.depositCharges}}</div>
									</div>
							  	</div>
								<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">租金费用</label>
									    <div class="form-control lin31">{{contractDatas.rentCharges}}</div>
									</div>
							  	</div>
								<div class="form-inline mb30">
									<div class="form-group">
									    <label class="mr15">交租日期</label>
									    <div class="form-control lin31">{{contractDatas.rentDay}}</div>
									    <label class="le">已付期数</label>
									    <div class="form-control lin31">{{contractDatas.validRentDay}}</div>
									</div>
							  	</div>
							</div>
						</div>
					</div>
				</div>
			</form>
			<form class="form-horizontal m-t" id="_ajaxForm2" style="display: none;">
				<div class="panel panel-default">
					<div class="panel-heading text-center">合同详情</div>
					<div class="panel-body">
						<p>出租方：<span>{{contractDatas.landlordName}}</span>（以下简称甲方）</p>
						<p>地址：<span>{{contractDatas.houseAddress}}</span></p>
						<p>承租方：<span>{{contractDatas.tenantName}}</span>（以下简称乙方）</p>
						<p>证件号码：<span>{{contractDatas.tenantIdCard}}</span></p>
						<!--<p>联系地址：<span>？？？？</span></p>-->
						<p>电话：<span>{{contractDatas.tenantPhone}}</span></p>
						<p>甲乙双方根据中华人民共和国法律和上海市相关法规，就租赁房屋事宜，经双方协商一致订立租赁合同如下：</p>
						<p>第一条：出租房屋</p>
						<p>1.1地址：<span>{{contractDatas.detailedAddress}} 以下简称该房屋</span></p>
						<p>第二条：租赁部位及面积</p>
						<p>2.1甲方将该房屋在完全装修且良好状态下出租给乙方，租用建筑面积总计 <span>{{contractDatas.roomArea}}</span> 平方米</p>
						<p>第三条：租赁目的</p>
						<p>3.1 乙方向甲方承诺，租赁该房屋作为 居住 使用，并遵守国家和本市相关房屋使用和房屋管理的规定。</p>
						<p>3.2 乙方保证：在租赁期内未征得甲方书面同意以及按规定须经有关部门审批核准前，不擅自改变上款约定的使用用途，不得群租，不得作为商用，否则将视为违约赔偿两个月的租金为违约金。</p>
						<p>第四条：租赁期限</p>
						<p>4.1租赁期 自 <span>{{contractDatas.leaseStartTime}}</span> 起至 <span>{{contractDatas.leaseEndTime}}</span></p>
						<p>4.2固定期 自 <span>{{contractDatas.fixationStartTime}}</span> 起至 <span>{{contractDatas.fixationEndTime}}</span></p>
						<p>4.3非固定期 自 <span>{{contractDatas.flexibleStartTime}}</span> 起至 <span>{{contractDatas.flexibleEndTime}}</span></p>
					</div>
				</div>
			</form>
			<form class="form-horizontal m-t" id="_ajaxForm3" style="display: none;">
				<div class="panel panel-default">
					<div class="panel-heading text-center">补充详情</div>
					<div class="panel-body">
						<p ng-bind-html="contractDatas.contrctDetails"></p>
					</div>
				</div>
			</form>
		</div>
	</div>
	
</div>


